import Vue from 'vue';
import Axios from 'axios';
import Qs from 'qs';
import VModal from 'vue-js-modal';
import '../basic/basic.css';
Vue.use(VModal,{dialog:true});

new Vue({
    el:'#louie-add',
    data:{
        //--公共--
        url:$('#louie-add').attr('data-url'),
        //--宝藏数据--
        name:'',  //宝藏名称
        icon:''  //宝藏图标
    },
    methods:{
        //新增提交
        submit:function(){
            if(this.checkData()){
                var data = {
                    name:this.name,
                    icon:document.add.icon.value
                }
                Axios.post(this.url,Qs.stringify({
                    pages:'treasure',
                    doing:'add',
                    data:data
                }))
                    .then((res)=>{
                        if(res.data.status == 'success'){
                            this.alert('添加成功');
                            this.name = '';
                            document.add.icon.value = '';
                            $('#louie-add .img-thumbnail')[0].src = '';
                        }else{
                            this.alert('添加失败');
                        }
                    })
                    .catch(error=>console.log(error));
            }
        },
        //添加验证数据
        checkData:function(){
            if(this.name == ''){
                this.alert('请输入宝藏名称');
                return false;
            }
            if(this.name.length > 20){
                this.alert('宝藏名称长度不能大于20');
                return false;
            }
            if(document.add.icon.value == ''){
                this.alert('请上传宝藏图标');
                return false;
            }
            return true;
        },
        //alert
        alert:function(text){
            this.$modal.show('dialog',{
                text:text,
                buttons:[
                    {title:'关闭'}
                ]
            });
        }
    }
});

